<!--{template common/container/pc/header_start}-->
<link rel="stylesheet" href="static/scss/default/index.css?{VERHASH}">
<link rel="stylesheet" href="user/my/template/pc/assets/index.css?{VERHASH}">
<link rel="stylesheet" href="{MOD_PATH}/template/storehouse/pc/assets/css/library.css?{VERHASH}">
<style>

</style>
<!--{template common/container/pc/header_end}-->
<div id="dzzoffice">
	<el-container class="page-main">
		<!--{template common/container/pc/header_default}-->
		<el-main>
		<div class="container">
			<!--{template common/container/pc/ucenter_header}-->
			<div class="notification" style="border: 0;background: transparent;padding: 20px 0;">
			
                <ul class="wrap-content">
                    <!--{loop $data $val}-->
                    <li 
                        class="piece" style="cursor: default;">
                        <el-card shadow="hover"> 
                            <a 
								href="{$val[url]}"
								class="box-images" 
								style="--background-image-url: url($val[icon])">
                                <el-image style="width: 100%; height: 100%;" src="$val[icon]" fit="contain">
                                    <template #error><div class="el-image__placeholder"></div></template>
                                </el-image>>
                            </a>
                            <div class="layer">
                                <div style="height: 96px;padding-top: 24px;">
                                    <p class="name">
                                        <!--{if item.type == 1}-->
                                        <el-image
                                            style="width: 22px; height: 22px;margin-right: 8px;"
                                            src="dzz/pichome/image/library/file.png"
                                            fit="contain">
                                            <template #error><div class="el-image__placeholder"></div></template>
                                        </el-image>
                                        <!--{elseif item.type == 2}-->
                                            <el-image
                                            style="width: 22px; height: 22px;margin-right: 8px;"
                                                src="dzz/pichome/image/library/billfish.png"
                                                fit="contain">
                                                <template #error><div class="el-image__placeholder"></div></template>
                                            </el-image>
                                        <!--{else}-->
                                        <el-image
                                        style="width: 22px; height: 22px;margin-right: 8px;"
                                            src="dzz/pichome/image/library/eagle.png"
                                            fit="contain">
                                            <template #error><div class="el-image__placeholder"></div></template>
                                        </el-image>
                                        <!--{/if}-->
                                        <el-text class="el-text--default" truncated style="font-size: 20px;font-weight: 700;
                                        color: var(--el-text-color-primary);">{$val[appname]}</el-text>
                                    </p>
                                    <div>
                                        <el-link 
                                            class="link" 
                                            type="primary" 
                                            href="$val[url]" 
                                            target="_blank"
                                            :underline="false"
                                        >{$_G['siteurl']}{$val[url]}</el-link>
                                    </div>
                                </div>
								<div class="operation">
									<a class="el-button el-button--success edit" :href="'{MOD_URL}&op=library&do=filelist#appid=$val[appid]'" target="_blank">
										<span>编辑</span>
									</a>
								</div>
                            </div>
                            </template>
                        </el-card>
                    </li>
                    <!--{/loop}-->
                </ul>
			</div>
			</div>
		</el-main>
	</el-container>
</div>

<script type="text/javascript">
	const { createApp, reactive, toRefs, toRef, ref, onMounted, nextTick, watch } = Vue;
	const dzzoffice = createApp({
		data() {
			return {
				DocumentThemeColor:'',
				UcenterHeaderMenuIndex:'library',
			}
		},
        mixins:[UcenterHeader],
		watch:{
			DocumentThemeColor:{
				handler(newval){
					document.querySelector('html').className = newval
				},
				deep:true,
				// immediate:true
			}
			
			
		},
		created() {
			 //主题颜色
			let theme = localStorage.getItem('theme');
			if(theme){
				this.DocumentThemeColor=theme;
			}else{
				this.DocumentThemeColor = 'light'
			}
			
		},
		methods: {
			DocumentThemeChange(){
				if(this.DocumentThemeColor=='light'){
					this.DocumentThemeColor='dark';
					localStorage.setItem('theme','dark');
				}else{
					this.DocumentThemeColor='light';
					localStorage.setItem('theme','light');
				}
			},
			
			
			
		},
		mounted() {}
	});
	dzzoffice.use(ElementPlus, {
		locale: ElementPlusLocaleZhCn,
	});
	for (const [key, component] of Object.entries(ElementPlusIconsVue)) {
		dzzoffice.component(key, component)
	}
	dzzoffice.component('comavatar', comavatar)
	// 屏蔽警告信息
	dzzoffice.config.warnHandler = function(){return null};
	dzzoffice.mount('#dzzoffice');
</script>

<!--{template common/container/pc/footer}-->
